From dfc04a590d1aebd3d4331d93e3e09d7b408e87f2 Mon Sep 17 00:00:00 2001
From: Matthias Clasen <mclasen@redhat.com>
Date: Tue, 7 Jul 2020 02:05:18 -0400
Subject: [PATCH] inspector: Reshuffle the sidebar

Move the sidebar in the object page below the
object header, for a more logical hierarchy.
---
 gtk/inspector/inspector.css |   4 +
 gtk/inspector/window.c      |  17 ---
 gtk/inspector/window.ui     | 255 ++++++++++++++++++------------------
 3 files changed, 134 insertions(+), 142 deletions(-)

diff --git a/gtk/inspector/inspector.css b/gtk/inspector/inspector.css
index e0b3c7ecf7..857fb2f8ce 100644
--- a/gtk/inspector/inspector.css
+++ b/gtk/inspector/inspector.css
@@ -45,3 +45,7 @@
 .list .cell combobox {
   padding: 0 4px;
 }
+
+stacksidebar.object-details {
+  border-top: 1px solid lightgray;
+}
diff --git a/gtk/inspector/window.c b/gtk/inspector/window.c
index b2142de98c..a064a93c4d 100644
--- a/gtk/inspector/window.c
+++ b/gtk/inspector/window.c
@@ -316,22 +316,6 @@ object_details_changed (GtkWidget          *combo,
   gtk_stack_set_visible_child_name (GTK_STACK (iw->object_center_stack), "title");
 }
 
-static void
-toggle_sidebar (GtkWidget          *button,
-                GtkInspectorWindow *iw)
-{
-  if (gtk_revealer_get_child_revealed (GTK_REVEALER (iw->sidebar_revealer)))
-    {
-      gtk_revealer_set_reveal_child (GTK_REVEALER (iw->sidebar_revealer), FALSE);
-      gtk_button_set_icon_name (GTK_BUTTON (button), "go-next-symbolic");
-    }
-  else
-    {
-      gtk_revealer_set_reveal_child (GTK_REVEALER (iw->sidebar_revealer), TRUE);
-      gtk_button_set_icon_name (GTK_BUTTON (button), "go-previous-symbolic");
-    }
-}
-
 static void
 go_up_cb (GtkWidget          *button,
           GtkInspectorWindow *iw)
@@ -674,7 +658,6 @@ gtk_inspector_window_class_init (GtkInspectorWindowClass *klass)
   gtk_widget_class_bind_template_callback (widget_class, close_object_details);
   gtk_widget_class_bind_template_callback (widget_class, object_details_changed);
   gtk_widget_class_bind_template_callback (widget_class, notify_node);
-  gtk_widget_class_bind_template_callback (widget_class, toggle_sidebar);
   gtk_widget_class_bind_template_callback (widget_class, go_previous_cb);
   gtk_widget_class_bind_template_callback (widget_class, go_up_cb);
   gtk_widget_class_bind_template_callback (widget_class, go_down_cb);
diff --git a/gtk/inspector/window.ui b/gtk/inspector/window.ui
index d7a51826c3..5a46d0fb15 100644
--- a/gtk/inspector/window.ui
+++ b/gtk/inspector/window.ui
@@ -207,17 +207,6 @@
                     <property name="name">object-details</property>
                     <property name="child">
                       <object class="GtkBox">
-                        <child>
-                          <object class="GtkRevealer" id="sidebar_revealer">
-                            <property name="transition-type">slide-right</property>
-                            <property name="reveal-child">1</property>
-                            <child>
-                              <object class="GtkStackSidebar">
-                                <property name="stack">object_details</property>
-                              </object>
-                            </child>
-                          </object>
-                        </child>
                         <child>
                           <object class="GtkBox">
                             <property name="orientation">vertical</property>
@@ -226,17 +215,16 @@
                                 <child type="start">
                                   <object class="GtkBox">
                                     <child>
-                                      <object class="GtkButton">
-                                        <property name="icon-name">go-previous-symbolic</property>
+                                      <object class="GtkToggleButton" id="sidebar_toggle">
+                                        <property name="icon-name">open-menu-symbolic</property>
                                         <property name="tooltip-text" translatable="yes">Toggle Sidebar</property>
-                                        <property name="has-frame">0</property>
                                         <property name="margin-start">6</property>
                                         <property name="margin-end">6</property>
                                         <property name="margin-top">6</property>
                                         <property name="margin-bottom">6</property>
                                         <property name="halign">center</property>
                                         <property name="valign">center</property>
-                                        <signal name="clicked" handler="toggle_sidebar"/>
+                                        <property name="active">1</property>
                                       </object>
                                     </child>
                                     <child>
@@ -393,129 +381,146 @@
                               </object>
                             </child>
                             <child>
-                              <object class="GtkStack" id="object_details">
-                                <signal name="notify::visible-child" handler="object_details_changed"/>
+                              <object class="GtkBox">
                                 <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">misc</property>
-                                    <property name="title" translatable="yes">Miscellaneous</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorMiscInfo" id="misc_info">
+                                  <object class="GtkRevealer" id="sidebar_revealer">
+                                    <property name="transition-type">slide-right</property>
+                                    <property name="reveal-child" bind-source="sidebar_toggle" bind-property="active" bind-flags="sync-create"/>
+                                    <child>
+                                      <object class="GtkStackSidebar">
+                                        <property name="stack">object_details</property>
+                                        <style>
+                                          <class name="object-details"/>
+                                        </style>
                                       </object>
-                                    </property>
+                                    </child>
                                   </object>
                                 </child>
                                 <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">properties</property>
-                                    <property name="title" translatable="yes">Properties</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorPropList" id="prop_list">
-                                        <property name="search-entry">prop_search_entry</property>
+                                  <object class="GtkStack" id="object_details">
+                                    <signal name="notify::visible-child" handler="object_details_changed"/>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">misc</property>
+                                        <property name="title" translatable="yes">Miscellaneous</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorMiscInfo" id="misc_info">
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">layout_properties</property>
-                                    <property name="title" translatable="yes">Layout</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorPropList" id="layout_prop_list">
-                                        <property name="search-entry">layout_prop_search_entry</property>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">properties</property>
+                                        <property name="title" translatable="yes">Properties</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorPropList" id="prop_list">
+                                            <property name="search-entry">prop_search_entry</property>
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">css-nodes</property>
-                                    <property name="title" translatable="yes">CSS Nodes</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorCssNodeTree" id="widget_css_node_tree">
-                                        <signal name="notify::node" handler="notify_node"/>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">layout_properties</property>
+                                        <property name="title" translatable="yes">Layout</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorPropList" id="layout_prop_list">
+                                            <property name="search-entry">layout_prop_search_entry</property>
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">size-groups</property>
-                                    <property name="title" translatable="yes">Size Groups</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorSizeGroups" id="size_groups"/>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">data</property>
-                                    <property name="title" translatable="yes">Data</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorTreeData" id="tree_data"/>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">list-data</property>
-                                    <property name="title" translatable="yes">Data</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorListData" id="list_data">
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">css-nodes</property>
+                                        <property name="title" translatable="yes">CSS Nodes</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorCssNodeTree" id="widget_css_node_tree">
+                                            <signal name="notify::node" handler="notify_node"/>
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">actions</property>
-                                    <property name="title" translatable="yes">Actions</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorActions" id="actions">
-                                        <property name="button">refresh_actions_button</property>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">size-groups</property>
+                                        <property name="title" translatable="yes">Size Groups</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorSizeGroups" id="size_groups"/>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">menu</property>
-                                    <property name="title" translatable="yes">Menu</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorMenu" id="menu"/>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">controllers</property>
-                                    <property name="title" translatable="yes">Controllers</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorControllers" id="controllers">
-                                        <property name="object-tree">object_tree</property>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">data</property>
+                                        <property name="title" translatable="yes">Data</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorTreeData" id="tree_data"/>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">magnifier</property>
-                                    <property name="title" translatable="yes">Magnifier</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorMagnifier" id="magnifier">
-                                        <property name="adjustment">magnification_adjustment</property>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">list-data</property>
+                                        <property name="title" translatable="yes">Data</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorListData" id="list_data">
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
-                                  </object>
-                                </child>
-                                <child>
-                                  <object class="GtkStackPage">
-                                    <property name="name">shortcuts</property>
-                                    <property name="title" translatable="yes">Shortcuts</property>
-                                    <property name="child">
-                                      <object class="GtkInspectorShortcuts" id="shortcuts">
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">actions</property>
+                                        <property name="title" translatable="yes">Actions</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorActions" id="actions">
+                                            <property name="button">refresh_actions_button</property>
+                                          </object>
+                                        </property>
                                       </object>
-                                    </property>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">menu</property>
+                                        <property name="title" translatable="yes">Menu</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorMenu" id="menu"/>
+                                        </property>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">controllers</property>
+                                        <property name="title" translatable="yes">Controllers</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorControllers" id="controllers">
+                                          </object>
+                                        </property>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">magnifier</property>
+                                        <property name="title" translatable="yes">Magnifier</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorMagnifier" id="magnifier">
+                                            <property name="adjustment">magnification_adjustment</property>
+                                          </object>
+                                        </property>
+                                      </object>
+                                    </child>
+                                    <child>
+                                      <object class="GtkStackPage">
+                                        <property name="name">shortcuts</property>
+                                        <property name="title" translatable="yes">Shortcuts</property>
+                                        <property name="child">
+                                          <object class="GtkInspectorShortcuts" id="shortcuts">
+                                          </object>
+                                        </property>
+                                      </object>
+                                    </child>
                                   </object>
                                 </child>
                               </object>
-- 
2.30.2